<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head th:fragment="header">
		<meta charset="utf-8" />
		<link rel="stylesheet" type="text/css" href="../../../resources/css/bootstrap.min.css" th:href="@{/resources/css/bootstrap.min.css}" />
		<link rel="stylesheet" type="text/css" href="../../../resources/css/bootstrap-responsive.min.css" th:href="@{/resources/css/bootstrap-responsive.min.css}" />
		<link rel="stylesheet" type="text/css" href="../../../resources/css/content.css" th:href="@{/resources/css/content.css}" />
		<title th:text="#{common.title}">Bezbarier title</title>
	</head>
	<body>
		<div>
		</div>
		<div th:fragment="menu" class="navbar">
			<div class="navbar-inner">
				<div class="container">
					<a th:href="@{/}" th:text="#{menu.brand}" href="#" class="brand">BezBarier</a>
					<ul class="nav">
						<li th:class="${menu == 'map'}? 'active'"><a th:href="@{/map}" th:text="#{menu.map}" href="#">Mapa</a></li>	
						<li th:class="${menu == 'catalog'}? 'active'"><a th:href="@{/catalog}" th:text="#{menu.catalog}" href="#">Procházet</a></li>	
						<li><a th:href="@{/admin/user/list}" th:if="${sec.hasRole('ADMIN')}" th:text="#{menu.admin.user}" href="#">Administrace uzivatelu</a></li>	
						<li th:class="${menu == 'login'}? 'active'"><a th:href="@{/login}" th:if="${sec.isAnonymous()}" th:text="#{menu.login}" href="#">Login</a></li>	
						<li><a th:href="@{'/profile/' + ${user.id}}" th:if="${sec.hasRole('AUTHORIZED')}" th:text="#{menu.profile}" href="#">Profil</a></li>
						<li><a th:href="@{/logout}" th:if="${sec.isAuthenticated()}" th:text="#{menu.logout}" href="#">Logout</a></li>	
					</ul>
					<ul class="nav pull-right">
						<li><a href="?lang=en">EN</a></li>	
						<li><a href="?lang=cs">CS</a></li>	
					</ul>
				</div>
			</div>
		</div>
		
		<div th:fragment="menu-light" class="navbar">
			<div class="navbar-inner">
				<div class="container">
					<a th:href="@{/}" th:text="#{menu.brand}" href="#" class="brand">BezBarier</a>
					<ul class="nav">
						<li th:class="${menu == 'map'}? 'active'"><a th:href="@{/map}" th:text="#{menu.map}" href="#">Mapa</a></li>	
						<li th:class="${menu == 'catalog'}? 'active'"><a th:href="@{/catalog}" th:text="#{menu.catalog}" href="#">Procházet</a></li>	
					</ul>
					<ul class="nav pull-right">
						<li><a href="?lang=en">EN</a></li>	
						<li><a href="?lang=cs">CS</a></li>	
					</ul>
				</div>
			</div>
		</div>
		<div th:fragment="messages">
			<div th:each="message : ${flashMessages}" th:if="${message.severity.name() == 'INFO'}" class="alert alert-success">
				<button type="button" class="close" data-dismiss="alert">x</button>
				<strong th:text="#{info}">Info:</strong> <span th:text="${message.message}">Best check yo self, you're not looking too good.</span>
			</div>
			<div th:each="message : ${flashMessages}" th:if="${message.severity.name() == 'WARN'}" class="alert">
				<button type="button" class="close" data-dismiss="alert">x</button>
				<strong th:text="#{warning}">Warning!</strong> <span th:text="${message.message}">Best check yo self, you're not looking too good.</span>
			</div>
			<div th:each="message : ${flashMessages}" th:if="${message.severity.name() == 'ERROR'}" class="alert alert-error">
				<button type="button" class="close" data-dismiss="alert">x</button>
				<strong th:text="#{error}">ERROR!</strong> <span th:text="${message.message}">Best check yo self, you're not looking too good.</span>
			</div>
		</div>
		
		<div th:fragment="pagination" class="pagination pagination-centered" th:with="query=${#httpServletRequest.getQueryString()}?: ''">
			<ul>
				<li th:class="${page.firstPage}? 'disabled'"><a th:unless="${page.firstPage}"  th:href="@{'/catalog/' + ${page.number} + '?' + ${query}}" href="#">Prev</a><span th:if="${page.firstPage}">Prev</span></li>
				<li><a th:each="p : ${page.prevPages}" th:href="@{'/catalog/' + ${p} + '?' + ${query}}" th:text="${p}" href="#">1</a></li>
				<li><span class="active" th:text="${page.number + 1}">1</span></li>
				<li><a th:each="p : ${page.nextPages}" th:href="@{'/catalog/' + ${p} + '?' + ${query}}" th:text="${p}" href="#">1</a></li>
				<li th:class="${page.lastPage}? 'disabled'"><a th:unless="${page.lastPage}" th:href="@{'/catalog/' + ${page.number + 2} + '?' + ${query}}" href="#">Next</a><span th:if="${page.lastPage}">Next</span></li>
			</ul>
		</div>

		<div th:fragment="js">
			<script type="text/javascript" src="../../../resources/js/jquery-1.8.3.min.js" th:src="@{/resources/js/jquery-1.8.3.min.js}"></script>
			<script type="text/javascript" src="../../../resources/js/bootstrap.min.js" th:src="@{/resources/js/bootstrap.min.js}"></script>
			<script type="text/javascript" src="../../../resources/js/bootstrap.min.js" th:src="@{/resources/js/bootbox.min.js}"></script>
		</div>
	</body>
</html>